<template>
    <svg t="1564192776791" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" >
        <g class="arrow">
            <path d="M512 67.38c-170.28 0-308.32 138-308.32 308.31 0 89.28 38.18 169.45 98.83 225.76L512 859.14l209.5-257.69c60.64-56.31 98.82-136.48 98.82-225.76C820.32 205.4 682.28 67.38 512 67.38z m2.2 427a168.17 168.17 0 1 1 168.18-168.19 168.17 168.17 0 0 1-168.17 168.16z" :fill="color" p-id="3681"></path>
            <path d="M512 871.64a12.5 12.5 0 0 1-9.7-4.62L293.36 610a321 321 0 0 1-74.42-104 320.77 320.77 0 0 1 519.91-357.2 320.11 320.11 0 0 1-8.2 461.2L521.71 867a12.5 12.5 0 0 1-9.71 4.64z m0-791.76a295.41 295.41 0 0 0-201 512.41 12.51 12.51 0 0 1 1.19 1.28L512 839.32l199.8-245.76a12.5 12.5 0 0 1 1.19-1.28 296.23 296.23 0 0 0 69.25-96.46A295.73 295.73 0 0 0 512 79.88z m2.2 427c-99.62 0-180.66-81-180.66-180.66s81-180.68 180.66-180.68 180.68 81.05 180.68 180.68-81.05 180.63-180.67 180.63z m0-336.34c-85.83 0-155.66 69.84-155.66 155.68s69.83 155.66 155.66 155.66S669.88 412 669.88 326.19 600 170.51 514.21 170.51z" :fill="color" p-id="3682"></path>
            
        </g>
        <path d="M512 969.12c-107.24 0-208.21-11.23-284.32-31.62C145.45 915.46 102 885.24 102 850.11c0-26 23.2-49 68.95-68.37 40.06-17 96.32-30.61 162.7-39.46a12.5 12.5 0 1 1 3.3 24.78c-64.19 8.55-118.22 21.58-156.24 37.69-34.13 14.46-53.7 31-53.7 45.35 0 16.69 28.15 42.07 107.16 63.24 74.05 19.84 172.73 30.77 277.85 30.77s203.79-10.93 277.85-30.77C868.86 892.18 897 866.8 897 850.11c0-23.39-52.33-56.21-169.25-76.79a12.5 12.5 0 0 1 4.33-24.62c55.19 9.71 101.41 23.12 133.65 38.78 37.34 18.13 56.27 39.2 56.27 62.63 0 35.14-43.46 65.36-125.69 87.39-76.1 20.39-177.07 31.62-284.31 31.62z" :fill="color" p-id="3683"></path>
        <path d="M512 969.12c-107.24 0-208.21-11.23-284.32-31.62C145.45 915.46 102 885.24 102 850.11c0-26 23.2-49 68.95-68.37 40.06-17 96.32-30.61 162.7-39.46a12.5 12.5 0 1 1 3.3 24.78c-64.19 8.55-118.22 21.58-156.24 37.69-34.13 14.46-53.7 31-53.7 45.35 0 16.69 28.15 42.07 107.16 63.24 74.05 19.84 172.73 30.77 277.85 30.77s203.79-10.93 277.85-30.77C868.86 892.18 897 866.8 897 850.11c0-23.39-52.33-56.21-169.25-76.79a12.5 12.5 0 0 1 4.33-24.62c55.19 9.71 101.41 23.12 133.65 38.78 37.34 18.13 56.27 39.2 56.27 62.63 0 35.14-43.46 65.36-125.69 87.39-76.1 20.39-177.07 31.62-284.31 31.62z" :fill="color" p-id="3684"></path></svg>
</template>

<script>
    export default {
        props:{
            size: {
                type: String,
                default: '120px'
            },
            color: {
                type: String,
                default: '#585858'
            }
        }
    }
</script>

<style lang="less" scoped>
@keyframes around
{
    from {
        transform: rotateY(0);
    }
    to {
        transform: rotateY(360deg);
    }
}

.arrow{
    transform-origin: center;
    animation: around 2s infinite;
}
</style>
